import React, { Component } from 'react';
import { Modal } from 'antd';
import { openModal, removeContainer } from 'components/method/openModal';

let container = null;

class CommonModal extends Component {

  render() {
    const { footer, onCancel, closable, width, className, visible, title } = this.props;
    return (
      <Modal
        className={className}
        visible={visible}
        width={width}
        footer={footer}
        onCancel={onCancel}
        closable={closable}
        title={title}
      >
        {React.cloneElement(this.props.children, { ...this.props })}
      </Modal>
    );
  }

  static propTypes = {
    footer: React.PropTypes.array,    // 底部按钮
    width: React.PropTypes.string,    // 宽度
    closable: React.PropTypes.bool,   // 点击确定回调
    onCancel: React.PropTypes.func,   // 取消事件
    className: React.PropTypes.string, // 样式
    title: React.PropTypes.string
  };

  static defaultProps = {
    footer: null,
    onCancel: () => {},
    closable: false,
    width: '100%',
    className: 'expense-new',
    title: null
  };
}

CommonModal.open = function (props, env) {
  const targetProps = {
    visible: true,
    loadWhenMount: true,
    afterClose: (data) => {
      props.handleClose(data);
      removeContainer(container);
      container = null;
    },
    ...props
  };

  !container
    ? container = openModal(CommonModal, targetProps, env)
    : container = openModal(CommonModal, targetProps, env, container);
};

CommonModal.close = function () {
  try {
    removeContainer(container);
    container = null;
  }
  catch (e) {}
};


export default CommonModal;
